<template>
  <div>
    <h1>文本显示组件</h1>
    <input v-model="userInput" placeholder="请输入文本" />
    <button @click="displayText">显示文本</button>
    <p v-if="displayedText">{{ displayedText }}</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      userInput: '', // 用于绑定输入框的文本
      displayedText: '' // 用于存储并显示点击按钮后的文本
    };
  },
  methods: {
    displayText() {
      // 将输入框的文本赋值给用于显示的变量
      this.displayedText = this.userInput;
    }
  }
};
</script>
